<script lang="ts" setup>
import { ref } from 'vue'
import { NButton, NInput, NSlider, useMessage } from 'naive-ui'
import { useApiSettingStore } from '@/store'
import type { ApiSettingsState } from '@/store/modules/apiSetting/helper'
import { t } from '@/locales'

const settingStore = useApiSettingStore()

const ms = useMessage()

const systemMessage = ref(settingStore.systemMessage ?? '')

const temperature = ref(settingStore.temperature ?? 0.5)

const top_p = ref(settingStore.top_p ?? 1)

const token = ref(settingStore.token ?? 'sk-123123123')

const proxyUrl = ref(settingStore.proxyUrl ?? "http://www.chosen1.xyz/")

function updateSettings(options: Partial<ApiSettingsState>) {
  settingStore.updateSetting(options)
  ms.success(t('common.success'))
}

</script>

<template>
  <div class="p-4 space-y-5 min-h-[200px]">
    <div class="space-y-6">
      <div class="flex items-center space-x-4">
        <span class="flex-shrink-0 w-[120px]">token：</span>
        <div class="flex-1">
          <NInput v-model:value="token" type="textarea"  :autosize="{ minRows: 1, maxRows: 4 }" />
        </div>
      </div>

			<div class="flex items-center space-x-4">
				<span class="flex-shrink-0 w-[120px]">代理地址：</span>
				<div class="flex-1">
					<NInput v-model:value="proxyUrl" type="textarea"  :autosize="{ minRows: 1, maxRows: 4 }" />
				</div>
			</div>
			<div class="flex-1 flex-shrink-0 overflow-hidden ">
				<NButton style=" border: none " block  @click="updateSettings({ token, proxyUrl})">
					{{ $t('common.save')  }}
				</NButton>
			</div>
    </div>
  </div>
</template>
